<!DOCTYPE html>
<html>

<head>
    <title></title>
    <style type="text/css">
        * {
            padding: 0;
            margin: 0;
        }
        
        #div1 {
            width: 100px;
            height: 100px;
            background-color: #ccc;
            margin: 100px auto;
            overflow: hidden;
        }
    </style>
    <script type="text/javascript">
        //"use strict";

        function Product(name, price) {
            this.name = name;
            this.price = price;
        }

        function Food(name, price) {
            console.log('this', this)
            Product.call(this, name, price);
            //Product(name, price);
            // Product.apply(this, [name, price]);
            this.category = 'food';
        }

        /* function Toy(name, price) {
             // Product.call(this, name, price);
             Product.apply(this, [name, price])
             this.category = 'toy';
         }*/

        var cheese = new Food('feta', 5);
        // var fun = new Toy('robot', 40);
        console.log('cheese', cheese)
            // console.log('fun', fun)
    </script>
</head>

<body>
    <div id="div1"></div>
</body>

</html>
